<template>
	<view class="content">
		<view class="title">
			<view>
				<text>审核状态：</text>
				<span v-if="aftersalesDetail.status === 1">正在审核</span>
				<span v-if="aftersalesDetail.status === 2">已通过审核</span>
				<span v-if="aftersalesDetail.status === 3">未通过审核</span>
				<span v-if="aftersalesDetail.status === 0">已撤回申请</span>
			</view>
			<view class="item-title">
				<text>退款金额：{{aftersalesDetail.refund}}</text><br />
				<text>退款方式：原路返回</text>
			</view>
		</view>
		<view class="middle">
			<text style="padding-top: 20upx;">服务类型：
				<span v-if="aftersalesDetail.type == 1">仅退款</span>
				<span v-if="aftersalesDetail.type == 2">退货退款</span>
			</text>
			<view class="nums">
				<text>申请数量:{{aftersalesDetail.nums}}</text>
			</view>
			<view class="problem">
				<text>问题描述：</text>
				<view style="width: 200upx;height: 100upx;">{{aftersalesDetail.reason}}</view>
			</view>
			<view>
				<text>售后图片:</text>
				<view class="img" style="width: 180upx;height: 180upx; border: 1px solid #DDDDDD;margin-top: 20upx;">
					<image :src="aftersalesDetail.imageUrl" style="width: 180upx;height: 180upx;"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {get,post,showToast} from '../../../js/common';
	export default {
		data() {
			return {
				logistics: '',
				logisticsId: '',
				aftersalesDetail: [],
				aftersalesId:'',
				imageUrl:'',
			};
		},
		onLoad(option) {
			this.aftersalesId = option.aftersalesId
		},
		onShow() {
			this.getuserAftersalesDetail()
		},
		methods: {
			getuserAftersalesDetail() {
				const params = {
					id:this.aftersalesId
				}
				post('mobileapi/mobile/member/usercenter/userAftersalesDetail', params).then(res => {
					this.aftersalesDetail = res.aftersalesDetail
					this.imageUrl = res.aftersalesDetail.imageUrl
				})
			}
		}
	}
</script>

<style>
	.title {
		font-size: 30upx;
		margin-top: 20upx;
		background: #ffffff;
		padding: 20upx;
	}

	.middle {
		background: #ffffff;
		margin-top: 20upx;
		font-size: 30upx;
		padding: 20upx;
		height: 620upx;
	}

	.item-title {
		border-top: 2upx solid #E6E6E6;
		margin: 20upx 0 20upx 0;
		padding-top: 20upx;
	}

	.nums {
		margin-top: 30upx;
		height: 60upx;
		padding-top: 20upx;
		border-top: 2upx solid #E6E6E6;
		border-bottom: 2upx solid #E6E6E6;
	}

	.problem {
		padding-top: 20upx;
		border-bottom: 2upx solid #E6E6E6;
	}
</style>
